import React, { useContext } from "react";
import { useState } from "react";

// 创建上下文对象
let globalContext = React.createContext();
function One() {
    // 使用 hooks useConetext 获取供应商数据 参数为上下文对象
    let value = useContext(globalContext);
    console.log(value)
    return (
        <div>
            <h1>子组件一</h1>
            <button onClick={()=>{
                value.setNum();
            }}>++</button>
        </div>
    )
}


function Two() {
    let value = useContext(globalContext)
    console.log(value)
    return (
        <div>
            <h2>子组件二---{value.num}</h2>
        </div>
    )
}


function App() {
    let [num,setNum] = useState(0)
    return (
        <div>
            <globalContext.Provider value={{
                num: num,
                setNum:()=>{
                    setNum(num+1)
                }
            }}>
                <One></One>
                <Two />
            </globalContext.Provider>
        </div>
    )
}


export default App;